<template>
  <div class="editor">
    <div id="editor"></div>
    <!-- <div class="submit" @click=submitfn()>提交</div> -->
  </div>
</template>

<script>
import E from "wangeditor";
export default {
  props: ["pid", "info"],
  data() {
    return {
      content: "",
    };
  },
  methods: {
    //数据提交
    // submitfn(){
    //   //调用父组件函数
    //    let token=  sessionStorage.getItem('token')
    //   let value= {'token':token,'info':this.content}
    //   this.$emit('submitfn',value)
    // }
  },
  mounted() {
    let that = this;
    // console.log(28);
    const editor = new E("#editor");

    //设置高度
    editor.config.height = 500;


    // 配置 onchange 回调函数
    editor.config.onchange = function (newHtml) {
      that.content = newHtml;
      localStorage.setItem("info", newHtml);

      // console.log("change 之后最新的 html", newHtml);
    };
    // 配置触发 onchange 的时间频率，默认为 200ms
    editor.config.onchangeTimeout = 500; // 修改为 500ms

    //  上传图片的api "http://api_dev.wanxikeji.cn/api/savePic"
    editor.config.customUploadImg = function (resultFiles, insertImgFn) {
      // resultFiles 是 input 中选中的文件列表
      
      // console.log(resultFiles[0]+' 48行');
      let file = resultFiles[0];
      console.log("file", file);
      let formData = new FormData();
      // formData.append("paramId", 1);
      formData.append("file", file);
      console.log(formData);
      // insertImgFn 是获取图片 url 后，插入到编辑器的方法
      that.$http.post("/api/saveFile", formData).then((res) => {
        console.log(res.data.data);
        let imgUrl = "http://api_dev.wanxikeji.cn/" + res.data.data;
        insertImgFn(imgUrl);
      });

      // 上传图片，返回结果，将图片插入到编辑器中

      // insertImgFn(imgUrl)
      // this.$uploading.uploadingimg('ssssdasdsa')
    };
    editor.create();
    // console.log(editor.$textElem.elems[0]+' 68行');
   
    //判断引入页面
    if (that.pid == 1) {
      let token = sessionStorage.getItem("token");
      that.$http
        .post("/api/admin/aboutInfo", { token: token, id: 2 })
        .then((res) => {
          console.log(res);
          editor.txt.html(res.data.data.info);
        });
    } else {
    }
    if (that.pid == 5) {
      let token = sessionStorage.getItem("token");
      let workId = localStorage.getItem("workId");
      console.log("token=", token);
      that.$http
        .post("api/admin/worksInfo", {
          token: token,
          id: workId,
        })
        .then((res) => {
          console.log("res", res);
          editor.txt.html(res.data.data.info);
        });
    } else {
    }
    if(that.pid == 6){
      // console.log('转换前',that.info)
      //转意符换成普通字符
      function excludeSpecial(s) {
        if(s !== null){
          // 去掉转义字符
          s = s.replace(/[\'\\\b\f\n\r\t]/g, '');
          // 去掉特殊字符
          // s = s.replace(/[\@\#\$\%\^\&\*\(\)\{\}\:\"\L\<\>\?\[\]]/);
          return s;
        }else{
          return s
        }
      };
      let htmlText = excludeSpecial(that.info)

      // console.log('转换hou',htmlText)
      let startIndex = htmlText.indexOf('"')
      let endIndex = htmlText.lastIndexOf('"')
      // console.log(startIndex,endIndex)
      htmlText = htmlText.substring(startIndex+1,endIndex)

    }
      // console.log("htmlText",htmlText);
    if (that.pid == 6) {
      console.log("转换前", that.info);
      //转意符换成普通字符
      function excludeSpecial(s) {
        // 去掉转义字符
        s = s.replace(/[\'\\\b\f\n\r\t]/g, "");
        // 去掉特殊字符
        // s = s.replace(/[\@\#\$\%\^\&\*\(\)\{\}\:\"\L\<\>\?\[\]]/);
        return s;
      }
      let htmlText = excludeSpecial(that.info);

      // console.log('富文本内容',htmlText)
      let startIndex = htmlText.indexOf('"');
      let endIndex = htmlText.lastIndexOf('"');
      // console.log(startIndex,endIndex)
      htmlText = htmlText.substring(startIndex + 1, endIndex);
      console.log("htmlText", htmlText);
      editor.txt.html(htmlText);
    } else {
    }
    if (that.pid == 11) {
      let token = sessionStorage.getItem("token");
      console.log(token);
      let id = localStorage.getItem("workId");
      this.$http.post("/api/admin/storyList", { token: token }).then((res) => {
        console.log(res);
        res.data.data.data.forEach((item) => {
          if (item.story_id == id) {
            editor.txt.html(item.info);
          }
        });
      });
    }
    if (that.pid == 3) {
      let token = sessionStorage.getItem("token");
      let id = 3;
      let value = { token: token, id: id };
      that.$http.post("/api/admin/aboutInfo", value).then((res) => {
        editor.txt.html(res.data.data.info);
      });
    }
  },
};
</script>

<style scoped>
.editor {
  width: 85%;
  border: 1px solid #cccc;
  margin-bottom: 20px;
}
#editor{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
</style>